上一篇主要介紹了網頁的結構，讓大家更了解網頁各個角色的各自分工與包含的內容。那今天就要正式進入到程式碼的部分，首先從基礎的HTML的基本骨架開始介紹。
剛開始看到各個不同的程式碼標，會覺得頭昏眼花，但其實實際去了解，才知道他們彼此都有屬於自己的使用方式與功用。
在 VS Code 建立一個 .html 檔案，並且輸入基本結構後，畫面通常會長這樣：
<!DOCTYPE html>
<html lang="zh-Hant">
<head>
<meta charset="UTF-8">
<title>我的第一個前端網頁</title>
</head>
<body>
<h1>哈囉，世界！</h1>
<p>這是我的前端記憶重修第一步。</p>
</body>
</html>
<!DOCTYPE html>
<html> ... </html>
lang="zh-Hant"是告訴瀏覽器這個網頁是用繁體中文寫的。<head> ... </head>（網頁的「幕後大腦」）<meta charset="UTF-8">:設定字元編碼，確保中文字不會變成奇怪的亂碼<title>:分頁標籤上顯示的網頁標題。<body> ... <body>（網頁的「實體舞台」）今天我們認識了 HTML 的基本骨架，知道了<head>是幕後大腦、<body> 是前台舞台。
有了這個最基本的容器後，明天我們就要正式把文字與標題（<h1>、<p> 等等）放進舞台裡，看看它們在瀏覽器裡實際長麼樣子！我們明天見囉！
iThome鐵人賽
看影片追技術